<template>
  <div>
    <!-- 事件绑定语法 语法v-on:事件类型  或者  @事件类型-->
    <p v-html="flag"></p>
    <!-- v-on 简写为@-->
    <button v-on:click="flag = flag + 1">点击加一</button>

    <!-- methods节点定义函数 -->
    <button v-on:click="add">点击加一methods</button>

    <!-- 传递参数 $event指的是事件对象参数(包含了dom中的常见方法，这个和原版dom方法是精简过的，貌似)-->
    <button @click="canshu(1, 2, $event)">传参</button>

    事件修饰符
  </div>
</template>

<script>
export default {
  data() {
    return {
      flag: 0,
    };
  },
  methods: {
    //定义函数的节点
    add() {
      this.flag = this.flag + 1;
    },
    canshu(a, b, e) {
      console.log(a, b, e);
    },
  },
};
</script>

<style>
</style>